.required {
    animation: required 1s linear infinite;
}

.content-form {
    background-color: rgb(50, 150, 100);
    color: rgb(255, 255, 255);
    margin: 8px;
    width: 320px;
    white-space: nowrap;
    overflow: overlay;
    animation: content-form 0.75s linear;
    filter: drop-shadow(0px 0px 2px rgba(50, 150, 100, 0.75));
}

.content-form-title {
    line-height: 48px;
    font-size: 32px;
    text-align: center;
    overflow: overlay;
    filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 0.5));
}

.content-form-detail {
    border-top: 4px dashed rgb(255, 255, 255);
    font-size: 20px;
    line-height: 32px;
    justify-content: center;
    overflow: overlay;
    filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 0.5));
}

.content-form-detail-content {
    margin: 8px 0px;
    text-align: center;
    display: flex;
    justify-content: center;
    overflow: overlay;
}

.content-form-detail-title {
    font-size: 20px;
    text-align: center;
    overflow: overlay;
}

.content-form-detail-content-input {
    background-color: rgb(255, 255, 255);
}

.content-form-detail-content-input-input {
    border: none;
    line-height: 32px;
    text-align: center;
    font-size: 20px;
    color: rgb(50, 150, 100);
    margin: 0px -8px;
    width: 304px;
}

.content-form-detail-content-choose-content-choose {
    cursor: pointer;
}

.content-form-detail-content-input-input::placeholder {
    color: rgba(50, 150, 100, 0.75);
    filter: drop-shadow(0px 0px 2px rgba(50, 150, 100, 0.75));
}

.content-form-detail-content-input-input:focus,
.content-form-detail-content-choose-content-choose:focus {
    outline: none;
}

.content-form-detail-content-choose-content-text {
    margin-right: 4px;
}

.content-form-detail-content-input-input:focus::placeholder {
    color: rgba(50, 150, 100, 0.25);
}

.content-form-detail-content-choose,
.content-form-detail-content-input {
    padding: 0px 8px;
    display: flex;
    overflow: overlay;
}

.content-form-detail-content-choose-content {
    margin: 0px 4px;
    display: flex;
    align-items: center;
}

.content-form-detail-content-choose-content-button {
    line-height: 32px;
    color: rgb(50, 150, 100);
    font-size: 20px;
    border: none;
    width: 64px;
    display: flex;
    justify-content: center;
    background-color: rgb(255, 255, 255);
    cursor: pointer;
    text-shadow: 0px 0px 2px rgba(50, 150, 100, 0.75);
}

input[type=password]::-ms-reveal {
    display: none;
}

input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 24px;
    height: 24px;
    border: 4px solid rgb(255, 255, 255);
    margin: 0px 4px;
    border-radius: 50%;
}

input[type="radio"]:checked {
    background-color: rgb(50, 150, 100);
}

input[type="radio"]:not(:checked) {
    background-color: rgb(255, 255, 255);
}

input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 24px;
    height: 24px;
    border: 4px solid rgb(255, 255, 255);
    margin: 0px 4px;
}

input[type="checkbox"]:checked {
    background-color: rgb(50, 150, 100);
}

input[type="checkbox"]:not(:checked) {
    background-color: rgb(255, 255, 255);
}

.content-form-title::-webkit-scrollbar-thumb,
.content-form-detail-title::-webkit-scrollbar-thumb,
.content-form-detail-content-choose::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.25);
}

.content-form-title::-webkit-scrollbar-thumb:hover,
.content-form-detail-title::-webkit-scrollbar-thumb:hover,
.content-form-detail-content-choose::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.5);
}

.content-form-title::-webkit-scrollbar-thumb:active,
.content-form-detail-title::-webkit-scrollbar-thumb:active,
.content-form-detail-content-choose::-webkit-scrollbar-thumb:active {
    background-color: rgba(255, 255, 255, 0.25);
}

.content-form-detail-content-input::-webkit-scrollbar-thumb {
    background-color: rgba(50, 150, 100, 0.25);
}

.content-form-detail-content-input::-webkit-scrollbar-thumb:hover {
    background-color: rgba(50, 150, 100, 0.5);
}

.content-form-detail-content-input::-webkit-scrollbar-thumb:active {
    background-color: rgba(50, 150, 100, 0.25);
}

@keyframes required {
    50% {
        background-color: rgba(50, 150, 100, 0.5);
    }
}

@keyframes content-form {
    0% {
        transform: scale(0);
    }

    50% {
        transform: scale(1);
    }

    75% {
        transform: scale(0.95);
    }

    100% {
        transform: scale(1);
    }
}

@media (max-width: 352px) {
    .content-form {
        margin-left: 0;
        margin-right: 0;
    }
}